<template>
  <!-- 编辑框 -->
  <a-modal
      :title="title"
      :visible="dialog"
      @ok="submitForm"
      @cancel="handleCancel"
      width="500px"
  >
    <a-form-model ref="form"
                  :model="form"
                  :rules="rules">
      <a-row  >
        <a-col >
          <a-form-model-item label="原密码" prop="old" class="row">
            <a-input v-model="form.old" type="password" />
          </a-form-model-item>
          <a-form-model-item label="新密码" prop="now" class="row">
            <a-input v-model="form.now" type="password" />
          </a-form-model-item>
          <a-form-model-item label="再次输入新密码" prop="again" class="row">
            <a-input v-model="form.again" type="password" />
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
  </a-modal>
</template>

<script>
import {updatePassword} from "@/services/user";
import {sha256} from "js-sha256";
const defaultForm = {
  old: '',
  now: '',
  again: ''
};

export default {
  name: "FormDialog",
  props: { },
  data() {
    const checkPass = (rule, value, cb) => {
      if (value === this.form.now) {
        return cb()
      }
      cb(new Error('两次输入密码不一致'))
    }
    return {
      title: "修改密码",
      dialog: false,
      isModalVisible: false,
      loading: true,
      form: {},
      again: '',
      rules: {
        old: [
          { required: true, message: '请输入原密码', trigger: 'blur' },
          // { pattern: /^[a-zA-Z0-9]+$/, required: true, message: "数字加英文，不包含特殊字符", trigger: "blur" },
        ],
        now: [
          { required: true, message: '请输入新密码', trigger: 'blur' },
          { pattern: /^[a-zA-Z0-9]+$/, required: true, message: "数字加英文，不包含特殊字符", trigger: "blur" },
        ],
        again: [
          { required: true, message: '请再次输入新密码', trigger: 'blur' },
          { pattern: /^[a-zA-Z0-9]+$/, required: true, message: "数字加英文，不包含特殊字符", trigger: "blur" },
          { validator: checkPass, trigger: 'blur' }
        ],
      }
    };
  },
  watch: {
  },
  created() {
    this.form = Object.assign({}, defaultForm);
  },
  methods: {
    resetForm() {
      this.form = Object.assign({}, defaultForm);
    },
    submitForm() {
      console.log(this.form)
      this.$refs["form"].validate((valid) => {
        if (valid) {
          this.loading = true;
          const that = this;
          const old = sha256(this.form.old)
          const now = sha256(this.form.now)
          updatePassword(old, now)
              .then((resp) => {
                let result = resp.data;
                if (result.code == 200) {
                  that.$message.success("操作成功", 2);
                  this.$emit("success");
                  that.resetForm();
                }else {
                  that.$message.error(result.message)
                }
                that.dialog = false;
                this.$emit("success");
                this.handleCancel();
              })
              .catch((res) => {
                this.loading = false;
                this.$message.error(res.response.data.message);
              });
        }
      });
    },
    handleCancel() {
      this.$nextTick(() => {
        this.$refs["form"].clearValidate();
      });
      this.form = Object.assign({}, defaultForm);
      this.loading = false;
      this.dialog = false;
    },
    filterOption(input, option) {
      return (
          option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },
  },
};
</script>

<style type="text/css">
.row {
  margin: 0 auto;
}
</style>
